<!doctype html>
<html>

<head>
  <meta charset="utf-8">
  <script type="text/javascript" src="./script/rem.js"></script>
  <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
  <meta content="yes" name="apple-mobile-web-app-capable">
  <meta content="yes" name="apple-touch-fullscreen">
  <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
  <link rel="stylesheet" type="text/css" href="./css/font-awesome.css" />
  <link rel="stylesheet" type="text/css" href="./css/style.css" />
  <script type="text/javascript" src="./script/jquery.min.js"></script>
  <script type="text/javascript" src="./script/base.js"></script>
  <script type="text/javascript" src="./script/doT.min.js"></script></head>

  <body>

    <header class="head" style="padding-top:0.4rem;" id="head" >
      <div class="head-l" tapmode onclick="closeWin()"><i class="fa fa-angle-left"></i></div>
      <h3 id="title">一品头条</h3>
      <div class="head-r"></div>
    </header>
    <div class="head-d" style="padding-top:0.4rem;"></div>
    <ul class="index-goods" id='list_new'>

    </ul>

    <script type="text/template" id="template_new">
      {{~it.data:value:index}}
      <ul class="list-new" onclick="index_web('{{=value.url}}')">
        <li onclick="index_web('{{=value.url}}')">
          {{=value.title}}
        </li>
      </ul>
      {{~}}
    </script>

  </body>
  <script type="text/javascript" src="./script/api.js"></script>
  <script type="text/javascript" src="./script/index.js"></script>
  <script type="text/javascript">
    apiready = function() {
      pullRefresh();
      pullLoading();
      // get_topic_data();
      get_new_data();

    }

    function get_new_data(more) {

        // 进度提示框
        api.showProgress({
          title: '努力加载中...',
          text: '请稍等...',
          modal: false
        });

        if (more) {
          page += 1;
        }else{
          page = 1;
        }

        api.ajax({
          url: webAddress+'/api/article/index?page=' + page + '&row=' + row,
          method: 'get',
          data: {
          }
        },function(ret, err){

          // 关闭上拉加载控件
          api.hideProgress();
          // 关闭下拉刷新控件
          api.refreshHeaderLoadDone();

          if (ret) {
            // alert(JSON.stringify( ret ));

            if (more) {
              templateFun(ret,1);
            }else{
              templateFun(ret);
            }


            // var template = $api.byId('template_new');
            // var dotFn = doT.template(template.innerHTML);
            // var html = dotFn(ret);
            // var list = $api.byId('list_new');
            // $api.html(list, html);

          } else {
            // alert( JSON.stringify( err ) );
          }
        });
      }

    // 模板赋值函数
    function templateFun(data,more){

      var template = $api.byId('template_new');
      var dotFn = doT.template(template.innerHTML);
      var html = dotFn(data);
      var list = $api.byId('list_new');

      if (more) {

        if (data.data.length) {

          $api.append(list, html);
        }else{

         api.toast({
          msg: '没有更多了',
          duration: 2000,
          location: 'bottom'
        });
         return; 
       }
     }else{
      if (data.data.length) {
       $api.html(list, html);
     }else{
      var html = '<h2 style="padding:1rem; text-align:center; color:#999; font-size:0.5rem;">暂无内容</h2>';
      list.innerHTML = html;
    }
  }
}

    // 下拉刷新
    function pullRefresh(){
      api.setRefreshHeaderInfo({
            // loadingImg: 'widget://image/refresh.png',
            bgColor: '#ccc',
            textColor: '#fff',
            textDown: '下拉刷新...',
            textUp: '松开刷新...'
          }, function(ret, err) {
            //在这里从服务器加载数据，加载完成后调用api.refreshHeaderLoadDone()方法恢复组件到默认状态
            get_new_data();
          });
    }

    // 上拉加载
    function pullLoading(){
        api.addEventListener({
          name: 'scrolltobottom',
          extra: {
            threshold: 0
        }
    }, function(ret, err){
        get_new_data(1);
    });
    }

    function index_web(url) {
      api.openWin({
        name: 'webview',
        url: './webview.html',
        bgColor:'#fff',
        pageParam: {
          url: url
        }
      });
    }


    function closeWin() {
      api.closeWin({});
    }
  </script>

  </html>
